<template>
  <div class="detailMain">
    <a-row>
      <a-col :lg="10" :xl="8" :xxl="6">
        <div class="top-btns">
          <a-button type="primary" @click="hander(1)"><a-icon type="audit" />审核</a-button>
          <a-button type="primary" @click="hander(2)"><a-icon type="info-circle" />拒绝</a-button>
          <a-button type="primary" @click="backList"><a-icon type="rollback" />返回</a-button>
        </div>
      </a-col>
    </a-row>
    <a-collapse v-model="activeKey">
      <a-collapse-panel header="基本信息" key="1">
        <a-row :gutter="16">
          <a-col :span="8">
            <p>流水号：{{detailData.order_no}}</p>
          </a-col>
          <a-col :span="8">
            <p>提现金额（元）：{{detailData.amount}}</p>
          </a-col>
          <a-col :span="8">
            <p>手续费（元）：{{detailData.fee}}</p>
          </a-col>
        </a-row>
        <a-row :gutter="16">
          <a-col :span="8">
            <p>到账金额（元）：{{detailData.actual_amount}}</p>
          </a-col>
          <a-col :span="8">
            <p>发起时间：{{detailData.created_at}}</p>
          </a-col>
          <a-col :span="8">
            <p>处理时间：{{detailData.processed_at}}</p>
          </a-col>
        </a-row>
        <a-row :gutter="16">
          <a-col :span="8">
            <p v-if="detailData.status === 0">审核状态：未处理</p>
            <p v-if="detailData.status === 1">审核状态：已审核</p>
            <p v-if="detailData.status === 2">审核状态：已拒绝</p>
          </a-col>
          <a-col :span="8">
            <p>操作人：{{detailData.admin}}</p>
          </a-col>
          <a-col :span="8">
            <p>备注：{{detailData.remark}}</p>
          </a-col>
        </a-row>
      </a-collapse-panel>
      <a-collapse-panel header="大区分公司信息" key="2">
        <a-row :gutter="16">
          <a-col :span="8">
            <p>大区分公司编号：{{detailData.partner_no}}</p>
          </a-col>
          <a-col :span="8">
            <p>大区分公司姓名：{{detailData.partner_name}}</p>
          </a-col>
          <a-col :span="8">
            <p>大区分公司手机：{{detailData.phone}}</p>
          </a-col>
        </a-row>
        <a-row :gutter="16">
          <a-col :span="24">
            <p>所属大区：{{detailData.region_name}}</p>
          </a-col>
        </a-row>
        <a-row :gutter="16">
          <a-col :span="8">
            <p>发起人编号:{{detailData.user}}</p>
          </a-col>
          <a-col :span="8">
            <p>发起人姓名:{{detailData.user_name}}</p>
          </a-col>
          <a-col :span="8">
            <p>发起人手机号：{{detailData.user_phone}}</p>
          </a-col>
        </a-row>
      </a-collapse-panel>
      <a-collapse-panel header="结算信息" key="3">
        <a-row :gutter="16">
          <a-col :span="8">
            <p>开户人名称：{{detailData.card_user}}</p>
          </a-col>
          <a-col :span="8">
            <p>身份证号 ：{{detailData.card_idno}}</p>
          </a-col>
          <a-col :span="8">
            <p>银行预留手机 ：{{detailData.bank_phone}}</p>
          </a-col>
        </a-row>
        <a-row :gutter="16">
          <a-col :span="8">
            <p>开户银行 ：{{detailData.bankname}}</p>
          </a-col>
          <a-col :span="8">
            <p>
              银行账号 ：
              {{detailData.bankcard}}
            </p>
          </a-col>
          <a-col :span="8">
            <p>
              开户行支行 ：
              {{detailData.branchname}}
            </p>
          </a-col>
        </a-row>
        <a-row :gutter="16">
          <a-col :span="8">
            <p>
              开户省份 ：
              {{detailData.bank_province }}
            </p>
          </a-col>
          <a-col :span="8">
            <p>
              开户城市 ：
              {{detailData.bank_city}}
            </p>
          </a-col>
          <a-col :span="8">
            <p>开户区/县 ：{{detailData.bank_district}}</p>
          </a-col>
        </a-row>
        <a-row :gutter="16">
          <a-col :span="8">
            <p>
              账户类型 ：
              {{detailData.bank_type==1?"对公":detailData.bank_type==2?"对私":""}}
            </p>
          </a-col>
        </a-row>
      </a-collapse-panel>
    </a-collapse>
    <div class="modal-wrap">
      <remarks
        :title="auditTitle==1?'通过审核':'拒绝审核'"
        :hint="`请确认是否${auditTitle==1?'通过审核':'拒绝审核'}?`"
        ref="remarks"
        :isRefuse="auditTitle"
        @remarksConfirm="handleAuditOk"
      />
    </div>
  </div>
</template>

<script>
import { cashWithdrawalDetail, examineOrrefuse } from '../../store/regionApi'
import { mixin } from '../../utils/remaksMixin'
export default {
  name: 'cashWithdrawalDetail',
  mixins: [mixin],
  data() {
    return {
      detailData: {},
      activeKey: ['1', '2', '3'],
      auditTitle: ''
    }
  },
  beforeMount() {
    this.getData()
  },
  methods: {
    // 获取数据
    getData() {
      cashWithdrawalDetail({
        id: this.$route.query.id
      }).then(res => {
        this.detailData = res.data
      })
    },
    // 审核或者拒绝
    hander(status) {
      if (Number(this.detailData.status) === 0) {
        this.auditTitle = status
        this.openRemaks()
      } else {
        this.$message.warning('该记录已审核，无法重复操作！')
      }
    },
    // 返回
    backList() {
      this.$router.go(-1)
    },
    // 组件回调
    handleAuditOk({ remarks }) {
      const data = {
        status: this.auditTitle,
        id: this.detailData.uuid
      }
      if (remarks) {
        data.memo = remarks
      }
      examineOrrefuse(data).then(e => {
        this.$message.success(e.data.message)
        this.backList()
      })
    }
  }
}
</script>

<style>
</style>
